<template>
    <view class="homeworkDetails">
		<view class="hkd-box">
		  <view class="hkd-list">
		<!-- 	   <view class="top-item">
				   <view>{{list.title}}</view>
				   <view></view>
			   </view> -->
			   <view>
				   <view class="title-s">
					   <text>作业名称：</text> {{homeworkInfo.title}}
				   </view>
				   <view class="content-s">
					   <text>作业介绍：</text> {{homeworkInfo.desc}}
				   </view>
				   <view class="content-s">
					   <text>状态：</text> 
					   <u-tag text="进行中" mode="light" type="success" size="mini" v-if="homeworkInfo && homeworkInfo.status && homeworkInfo.status == 10"/>
					   <u-tag text="已结束" mode="light" type="success" size="mini" v-else-if="homeworkInfo && homeworkInfo.status && homeworkInfo.status == 20"/>
				   </view>
				   <view class="content-s">
						<text>创建时间：</text> {{homeworkInfo && homeworkInfo.created_at ? homeworkInfo.created_at : '-'}}
				   </view>
				   <view class="content-s">
				   		<text>更新时间：</text> {{homeworkInfo && homeworkInfo.updated_at ? homeworkInfo.updated_at : '-'}}
				   </view>
				   <view class="content-s">
					   <text>提交截止时间：</text> {{homeworkInfo && homeworkInfo.deadline ? homeworkInfo.deadline : '-'}}
				   </view>
				   <view class="content-s" style="display: flex;flex-wrap: wrap;" v-for="(item,index) in homeworkInfo.attachment" :key="index" v-if="homeworkInfo.attachment.length > 0 && Array.isArray(homeworkInfo.attachment[0])">
					   <text >{{ index == 0 ? '图片素材：': '附件：'}}</text> 
					   <view>
						   <view v-if="index == 0">
							   <image :src="getImgUrl(m)" class="image__s" mode="aspectFill" v-for="(m,idx) in item" :key="idx"></image>
						   </view>
						   <view v-else>
							   <view style="color: #2979ff;margin-bottom: 10rpx;" v-for="(m,idx) in item" :key="idx">{{ getExtractString(m) }} <u-tag text="下载" mode="light" type="primary" size="mini" @click="onDownload(m)" v-if="m"/></view>
						   </view>
					   </view>
				   </view>
				   <view class="content-s" style="display: flex;" v-else-if="homeworkInfo.attachment.length > 0 && !Array.isArray(homeworkInfo.attachment[0])">
					   <text>附件：</text> 
					   <view>
						   <view style="color: #2979ff;margin-bottom: 10rpx;" v-for="(item,index) in homeworkInfo.attachment" :key="index">{{ getExtractString(item)}} <u-tag text="下载" mode="light" type="primary" size="mini" @click="onDownload(item)" v-if="item"/></view>
					   </view>
				   </view>
			   </view>
		  </view>
		  <view class="hkd-list" style="margin-top: 20rpx;" v-if="recordInfo != null">
		  	  <view class="top-item">
		  		   <view>提交记录</view>
		  		   <view></view>
		  	   </view>
		  	   <view>
				   <view class="content-s">
						<text>创建时间：</text> {{ recordInfo && recordInfo.created_at ? recordInfo.created_at : '-'}}
				   </view>
		  		   <view class="content-s">
		  		   		<text>最近提交时间：</text> {{recordInfo && recordInfo.submit_at ? recordInfo.submit_at : '-'}}
		  		   </view>

				   <view class="content-s">
					   <text>状态：</text> 
					   <u-tag text="未提交" mode="light" type="success" size="mini" v-if="recordInfo.status && recordInfo.status == 10"/>
					   <u-tag text="重新提交" mode="light" type="success" size="mini" v-else-if="recordInfo.status && recordInfo.status == 20"/>
					   <u-tag text="已完成" mode="light" type="success" size="mini" v-else-if="recordInfo.status && recordInfo.status == 30"/>
				   </view>
				   <view class="content-s">
					   <text>内容：</text> {{recordInfo.content}}
				   </view>
				   <view class="content-s" style="display: flex;flex-wrap: wrap;" v-for="(item,index) in recordInfo.attachment" :key="index" v-if="recordInfo.attachment.length > 0 && Array.isArray(recordInfo.attachment[0])">
					   <text >{{ index == 0 ? '图片素材：': '附件：'}}</text> 
					   <view>
						   <view v-if="index == 0">
							   <image :src="getImgUrl(m)" class="image__s" mode="aspectFill" v-for="(m,idx) in item" :key="idx"></image>
						   </view>
						  <view v-else>
							   <view style="color: #2979ff;margin-bottom: 10rpx;" v-for="(m,idx) in item" :key="idx" >{{ getExtractString(m) }} <u-tag text="下载" mode="light" type="primary" size="mini"  @click="onDownload(m)" v-if="m"/></view>
						  </view>
					   </view>
				   </view>
				   <view class="content-s" style="display: flex;" v-else-if="recordInfo.attachment.length > 0 && !Array.isArray(recordInfo.attachment[0])">
					   <text>附件：</text> 
					   <view>
						   <view style="color: #2979ff;margin-bottom: 10rpx;" v-for="(item,index) in recordInfo.attachment" :key="index">{{ getExtractString(item)}} <u-tag text="下载" mode="light" type="primary" size="mini" @click="onDownload(item)" v-if="item"/></view>
					   </view>
				   </view>
				   <view v-if="recordInfo && recordInfo.correct_at != ''">
					   <view class="content-s" style="color: #333">
					   		<text>批改作业</text>
					   </view>
					   <view class="content-s">
					   		<text>批改时间：</text> {{recordInfo && recordInfo.correct_at ? recordInfo.correct_at : '-'}}
					   </view>
					   <view class="content-s">
					   		<text>意见反馈：</text> {{recordInfo.feedback ? recordInfo.feedback : '-'}}
					   </view>
					   <view class="content-s" style="display: flex;flex-wrap: wrap;" v-for="(item,index) in recordInfo.correct_url" :key="index" v-if="recordInfo.correct_url.length > 0 && Array.isArray(recordInfo.correct_url[0])">
						   <text >{{ index == 0 ? '图片素材：': '附件：'}}</text> 
						   <view>
							   <view v-if="index == 0">
								   <image :src="getImgUrl(m)" class="image__s" mode="aspectFill" v-for="(m,idx) in item" :key="idx"></image>
							   </view>
							   <view v-else>
								   <view style="color: #2979ff;margin-bottom: 10rpx;" v-for="(m,idx) in item" :key="idx">{{ getExtractString(m) }} <u-tag text="下载" mode="light" type="primary" size="mini"  @click="onDownload(m)" v-if="m"/></view>
							   </view>
						   </view>
					   </view>
					   <view class="content-s" style="display: flex;" v-else-if="recordInfo.correct_url.length > 0 && !Array.isArray(recordInfo.correct_url[0])">
						   <text>附件：</text> 
						   <view>
							   <view style="color: #2979ff;margin-bottom: 10rpx;" v-for="(item,index) in recordInfo.correct_url" :key="index">{{ getExtractString(item)}} <u-tag text="下载" mode="light" type="primary" size="mini" @click="onDownload(item)" v-if="item"/></view>
						   </view>
					   </view>
				   </view>
		  	   </view>
		    </view>
		</view>
	</view>
</template>

<script>
 import { getEmptyPaginateObj, getMoreListData } from '@/core/app'
 import * as homeworkApi from '@/api/homework'
 import Config from '@/core/config'
import { ImgUrlPrefix } from '@/utils/util.js'

  // 每页记录数量
  const pageSize = 15
  export default {
    data() {
      return {
		list: {},
		record: {},
		id: ''
      }
    },

    /**
     * 生命周期函数--监听页面加载
     */
    onLoad(options) {
        this.id = options.id
		this.getDetailList()
    },
	computed: {
		homeworkInfo() {
			  let obj  = {}
			  const app = this
			  if(this.list) {
				  obj = { ...this.list, created_at: this.list.created_at ?  app.formattedDate(this.list.created_at) : '',updated_at: this.list.updated_at ?  app.formattedDate(this.list.updated_at) : '', deadline: this.list.deadline ? app.formattedDate(this.list.deadline) : '', attachment: this.list.attachment ? JSON.parse(this.list.attachment) : ''}
				   console.log(this.list,obj, 'this.list')
				  return obj
			  }
		},
		recordInfo() {
			let obj  = {}
			const app = this
			if(this.record) {
			  obj = { ...this.record,created_at: this.record.created_at ?  app.formattedDate(this.record.created_at) : '', submit_at: this.record.submit_at ? app.formattedDate(this.record.submit_at) : '',correct_at: this.record.correct_at ? app.formattedDate(this.record.correct_at) : '', attachment: this.record.attachment ? JSON.parse(this.record.attachment) : '', correct_url: this.record.correct_url ? JSON.parse(this.record.correct_url) : ''}
			  return obj
			}
		}
	},
    methods: {
	  // 获取作业详情
	  getDetailList(pageNo = 1) {
	    const app = this
	      homeworkApi.homeworkDetail({ id: Number(app.id), page: pageNo }, { load: false })
	        .then(result => {
	          // 合并新数据
	          app.list = result.data.detail // getMoreListData(newList, app.list, pageNo)
			  app.record = result.data.record
	        })
	  },
	  // 切换标签项
	  onChangeTab(index) {
	    const app = this
	    // 设置当前选中的标签
	    app.curTab = index
	    // 刷新订单列表
	    // app.onRefreshList()
	  },
	  formattedDate(val) {
	    const date = new Date(val * 1000);
	    const year = date.getFullYear();
	    const month = String(date.getMonth() + 1).padStart(2, '0');
	    const day = String(date.getDate()).padStart(2, '0');
	    const hours = String(date.getHours()).padStart(2, '0');
	    const minutes = String(date.getMinutes()).padStart(2, '0');
	    const seconds = String(date.getSeconds()).padStart(2, '0');
	    return `${year}-${month}-${day} ${hours}:${minutes}:${seconds}`;
	  },
	  // 图片地址拼接
	  getImgUrl(val) {
		  const url = ImgUrlPrefix(val)
		  return url
	  },
	  // 截取字符串
	  getExtractString(val) {
	      if(val) {
	          const startIndex = val.lastIndexOf('/') + 1
	          const url = val.substring(startIndex);
	          return url
	      } else{
	          return ''
	      }
	  },
	  // 去下载
	  onDownload: function(local_url) {
	  	   const app = this
	  	   const webUrl = Config.get('imgUrl')
	  	   uni.showLoading({ title: '正在下载' })
	  	   app.downloadLoding = true
	  	   console.log(webUrl + local_url)
		   // #ifdef APP-PLUS || MP-WEIXIN
		   // 下载海报图片
		   uni.downloadFile({
		     url: webUrl + local_url,
		     success(res) {
		       console.log(res)
		       uni.hideLoading()
			   if(res.statusCode==200){
				   var tempFilePath = res.tempFilePath;
				   app.saveFile(tempFilePath)
			   }else{
				   uni.showToast({
					   icon:'none',
					   title:'下载失败'
				   })
				   app.downloadLoding = false
			   }
		     },
		     fail(res) {
		       console.log('fail', res)
		       uni.hideLoading()
			   app.downloadLoding = false
		       app.$toast('很抱歉，下载失败', 3000)
		     }
		   })
		   // #endif
		   // #ifdef H5
		   window.open(webUrl + local_url, '_blank')
		   uni.hideLoading()
		   app.downloadLoding = false
		   // #endif

	  },
	  // 保存到本地
	  saveFile(tempFilePath){
	  	    const app = this
			uni.saveFile({
			    tempFilePath:tempFilePath,//临时路径
					success:res=>{
						//打开文档查看
						uni.openDocument({
							filePath:res.savedFilePath,
							showMenu: true, // 右上角菜单，可以进行分享保存pdf
							success:res=>{
								app.downloadLoding = false
							},
							fail() {
								app.downloadLoding = false
							}
						})
					},
					fail() {
						app.downloadLoding = false
					}
			})
	  }
    },
	/**
	 * 下拉刷新
	 */
	onPullDownRefresh() {
	  // 获取首页数据
	  this.getDetailList()
	  uni.stopPullDownRefresh()
	},
  }
</script>

<style lang="scss" scoped>
 .homeworkDetails{
	 .hkd-box{
		  padding: 16rpx;
		 .hkd-list{
			 background-color: #fff;
			 border-radius: 14rpx;
			 padding: 30rpx;
			 .top-item{
				 display: flex;
				 justify-content: space-between;
				 border-bottom: 1rpx solid #eee;
				 padding-bottom: 25rpx;
			 }
			 .title-s{
				line-height: 50rpx;
				// padding: 25rpx 0 0 0;
				font-size: 30rpx;
			 }
			 .content-s{
				 color: #999;
				 margin-top: 20rpx;
				 font-size: 24rpx;
			 }
			 .image__s{
				 width: 180rpx;
				 height:180rpx;
			 }
		 }
	 }
 }
</style>